define(function(require, exports, module) {

  var Backbone = require('backbone');
  var $ = require('jquery');
  var _ = require('underscore');
  var jsonview = require('jsonview');
  var tmpl = require('text!../tmpl.html');

  var VSHADER_SOURCE = require('text!../shader/vertex.glsl')
  var FSHADER_SOURCE = require('text!../shader/fragment.glsl')

  var __ = require('hy5b/gl/index')

  function main() {
    var $app = $('<div id="app">');
    $('#main').html($app);

    $app.append(tmpl);


    var logger = p;

    var elem = document.getElementById('webgl');

    var gl = getWebGLContext(elem);

    if (!gl) {
      logger("Your browser don't support webgl!!");
    }

    if (!initShaders(gl, VSHADER_SOURCE, FSHADER_SOURCE)) {
      logger("essl inited failed!!");
    }

    var initVertexBuffers = function() {
      var vertexs = new Float32Array([
        -0.5,0.5,-0.5,-0.5,0.5,0.5,0.5,-0.5
      ]);

      var n = 3;

      var vertexBuffer = gl.createBuffer();
      gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
      gl.bufferData(gl.ARRAY_BUFFER, vertexs, gl.STATIC_DRAW);

      var a_Position = gl.getAttribLocation(gl.program, 'a_Position');
      
      gl.vertexAttribPointer(a_Position, 2, gl.FLOAT, false, 0, 0);
      gl.enableVertexAttribArray(a_Position);

      return n;
    }

    var initFragColor = function() {
      var u_FragColor = gl.getUniformLocation(gl.program, 'u_FragColor');
      var g_colors = [1.0, 1.0, 0.0, 1.0];
      gl.uniform4f(u_FragColor, g_colors[0], g_colors[1], g_colors[2], g_colors[3]);
    }

    var initTransiton = function() {
      var u_Transition = gl.getUniformLocation(gl.program, 'u_Transition');
      var Tx = 0.5, Ty = 0.5, Tz = 0;
      gl.uniform4f(u_Transition, Tx, Ty, Tz, 0.0);
    }

    clearGl(gl);

    var n = initVertexBuffers();
    initFragColor();
    initTransiton();
    // gl.drawArrays(gl.TRIANGLE_FAN, 0, n);
    gl.drawArrays(gl.POINTS, 0, 3);
  }

  return main;
})
